<template>
    <div>
            <div>
                <el-button :size='size' type="primary" @click="refresh()">
                    刷新
                </el-button>
                <el-button :size='size' type="primary" @click="jump()">
                    跳转
                </el-button>
                <el-button :size='size' type="primary" @click="build()">
                    构建
                </el-button>
                <!-- <el-button :size='size' type="primary" @click="iframe()">
                    嵌入
                </el-button>
                <el-button :size='size' type="primary" @click="hide()">
                    隐藏
                </el-button> -->
            </div>

        <el-row style="height:100%;">
        <el-col :span="leftSpan" style="height:100%;" >
        <el-form label-width="100px" label-position="left">
            
            <cc-input name="接口名称" v-model="apiName" :style="style.input"></cc-input>

            <cc-input name="接口路径" v-model="apiPath" :style="style.input"></cc-input>

            <cc-input name="基础路径" v-model="apiBase" :style="style.input"></cc-input>

            <!-- 接口参数 -->
            <div style="width:320px; background:#eee; padding:5px;">接口参数

            <template v-for="(name, key) in apiParamDesc">
                <cc-input :name="name" v-model="apiParam[key]" :style="style.input"></cc-input>
            </template>

            </div>

            
        </el-form>

        </el-col>

        <!-- 
        <el-col :span="rightSpan" style="height: 100%;">
            <iframe :src="src" style="height:600px; width:100%;">

            </iframe>
        </el-col> 
        -->
        </el-row>
    </div>
</template>

<script>
import Orderadd from './api/orderadd.js';

var page = {
    data: function() {
        return {     
            leftSpan: 8,
            rightSpan: 16,
            src: "",  
            size: 'mini',
            // apiBase: 'http://localhost:9212/',
            apiBase: 'http://localhost:9211/api2.0/',
            // apiBase: 'http://localhost:9209/residualcar/handle/',
            // apiBase: 'https://prd.urtrust.com.cn/residualcar/handle/',
            apiName: '竞价发布',
            apiPath: 'api/orderadd',
            apiParam: {
                'timestamp': '20220429121212',
                'partnerId': 'utictest',
                'usercode': '9901001',
                'sign': 'testsignvalue',
                'brandName': '奥迪',
                'registNo': '123456789',
                'damageTime': '2022-04-25 11:11:11',
                'insuredAmount': '120.5',
                'frameNo': '',
                'licenseNo': '冀DPQ522',
                'defLossCarType': '050',
                'engineNo': 'fffff',
                'enrollDate': '2022-04-25',
                'phoneNo': '13539468674'
            },
            apiParamDesc: {
                'timestamp': '时间戳',
                'partnerId': '合作伙伴',
                'usercode': '工号',
                'sign': '签名',
                'brandName': '车型名称',
                'registNo': '报案号',
                'damageTime': '出险时间',
                'insuredAmount': '全损金额',
                'frameNo': '车架号',
                'licenseNo': '车牌号',
                'defLossCarType': '损失方',
                'engineNo': '发动号',
                'enrollDate': '初登日期',
                'phoneNo': '录入人员联系方式'
            },
            style: {
                input: 'width:320px;'
            }
        }
    },
    methods: {
        refresh() {
            // 刷新参数
            Orderadd.refresh(this.apiParam);
        },
        buildUrl() {
            var url = this.apiBase + this.apiPath;
            url = Tools.buildUrl(url, this.apiParam);
            console.log(url);
            return url;
        },
        jump() {
            var url = this.buildUrl();
            alert('跳转到：' + url);
            window.open(url);
        },
        build() {
            var url = this.buildUrl();
            console.log(url);
            UI.alert(url);
        },
        iframe() {
            var url = this.buildUrl();
            // 放到iframe里
            this.src = url;
        },
        hide() {
            this.leftSpan = 0;
            this.rightSpan = 24;
        }
    }
}
export default page;
</script>